// 目标1: 渲染图书列表
// 1.1 获取数据
// 1.2 渲染数据
const creator = '老吴'
    // 封装-获取并渲染图书列表函数
function getBooksList() {
    // 1.1 获取数据
    axios({
        url: 'http://hmajax.itheima.net/api/books',
        params: {
            creator
        }
    }).then(result => {
        console.log(result);
        const bookList = result.data.data
        console.log(bookList);

        // 1.2 渲染数据
        const htmlStr = bookList.map((item, index) => {
            return `<tr>
        <td>${index+1}</td>
        <td>${item.bookname}</td>
        <td>${item.author}</td>
        <td>${item.publisher}</td>
        <td>
            <span class="del">删除</span>
            <span class="edit">编辑</span>
        </td>
    </tr>`
        }).join('')

        console.log(htmlStr);
        /**
         * ['<tr>\n        <td>1</td>\n        <td>js</td>\n      …an class="edit">编辑</span>\n        </td>\n    </tr>', '<tr>\n        <td>1</td>\n        <td>js</td>\n      …an class="edit">编辑</span>\n        </td>\n    </tr>', '<tr>\n        <td>1</td>\n        <td>js</td>\n      …an class="edit">编辑</span>\n        </td>\n    </tr>']
         
        
        
        
        */
        /**
         * 加上join('')后，打印出：
         * <tr>
                <td>1</td>
                <td>js</td>
                <td>wo</td>
                <td>人民出版社</td>
                <td>
                    <span class="del">删除</span>
                    <span class="edit">编辑</span>
                </td>
            </tr><tr>
                <td>1</td>
                <td>js</td>
                <td>wo</td>
                <td>人民出版社</td>
                <td>
                    <span class="del">删除</span>
                    <span class="edit">编辑</span>
                </td>
            </tr><tr>
                <td>1</td>
                <td>js</td>
                <td>wo</td>
                <td>人民出版社</td>
                <td>
                    <span class="del">删除</span>
                    <span class="edit">编辑</span>
                </td>
            </tr>
         */
        document.querySelector('.list').innerHTML = htmlStr
    })


}

// 网页加载运行，获取并渲染列表一次
getBooksList()